<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Inner</title>
    <link rel="stylesheet" href="./css/animate.css">
    <link rel="stylesheet" href="./css/reset.css">
    <link rel="stylesheet" href="./css/common.css">
    <link rel="stylesheet" href="./css/inner.css">
</head>
<body>
     <!-- 头部 -->
     <header class="header">
        <img src="./img/Inner/banner.png" >
        <div class="juzhong">
            <!-- logo -->
            <div class="logo  wow fadeInUp" data-wow-delay="0ms">Webworld</div>

            <input type="checkbox" id="mobile" class="change" style="display: none;" />

            <label for="mobile">
                <span></span>
                <span></span>
                <span></span>
            </label>
            <!-- 导航 -->
            <nav class="menu ">
                <a href="./home.html" class="wow fadeInUp"  data-wow-delay="100ms">Home</a>
                <a href="./Inner.html"  class="wow fadeInUp"  data-wow-delay="200ms">Portfolio</a>
                <a href="./contact.html"  class="wow fadeInUp"  data-wow-delay="300ms">Contact</a>
            </nav>
        </div>
    </header>
    
    <div class="juzhong">
       
        <!-- 内容部分 -->
        <div class="content">
            <div class="left">
                <!-- logo -->
                <div class="logo wow fadeInUp" data-wow-delay="100ms">Webworld</div>

                <!-- 左边的标题 SEARCH -->
                <div class="title  wow fadeInUp" data-wow-delay="200ms">
                    <span><hr color="#e1e1e1" size="1"></span>
                    <h3>SEARCH</h3>
                    <span><hr color="#e1e1e1" size="1"></span>
                </div>
                
                <!-- input搜索框 -->
                <input type="text" placeholder="search...">

                <!-- 左边的标题Tweet.Tweet -->
                <div class="title  wow fadeInUp" data-wow-delay="300ms">
                    <span><hr color="#e1e1e1" size="1"></span>
                    <h3>Tweet.Tweet</h3>
                    <span><hr color="#e1e1e1" size="1"></span>
                </div>

                <!-- 文本描述 -->
                <div class="desc  wow fadeInUp" data-wow-delay="400ms">
                    <span>“</span>
                    <p>
                        Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's 
                    <br>
                        <a href="#">4 days ago</a>
                    </p>
                    
                </div>

                <div class="desc  wow fadeInUp" data-wow-delay="500ms">
                    <span>“</span>
                    <p>
                        Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's 
                    <br>
                        <a href="#">4 days ago</a>
                    </p>
                    
                </div>

                <div class="desc  wow fadeInUp" data-wow-delay="600ms">
                    <span>“</span>
                    <p>
                        Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's 
                    <br>
                        <a href="#">4 days ago</a>
                    </p>
                    
                </div>
                
                <!-- 左边的标题 Recent&nbsp;Posts-->
                <div class="title  wow fadeInUp" data-wow-delay="100ms">
                    <span><hr color="#e1e1e1"  size="1"></span>
                    <h3>Recent&nbsp;Posts</h3>
                    <span><hr color="#e1e1e1" size="1"></span>
                </div>

                <ul class="rp-desc  wow fadeInUp" data-wow-delay="200ms">
                    <li> <u>Lorem Ipsum is simply text.</u> </li>
                    <li>dummy text of the print.</li>
                    <li>ing and typesetting industry.</li>
                </ul>

                <!-- 左边的标题 BLOG Tags -->
                <div class="title  wow fadeInUp" data-wow-delay="300ms">
                    <span><hr color="#e1e1e1"  size="1"></span>
                    <h3>BLOG&nbsp;Tags</h3>
                    <span><hr color="#e1e1e1" size="1"></span>
                </div>

                <div class="bt-btns  wow fadeInUp" data-wow-delay="400ms">
                    <span>Design</span>
                    <span>Development</span>
                    <span>Envato</span>
                    <span>Themeforest</span>
                    <span>Themes</span>
                    <span>Uncategorized</span>
                    <span>WordPress</span>
                </div>
            </div>
            <div class="right">
                <div class="boxs">
                    <div class="blocks  wow fadeInUp" data-wow-delay="100ms">
                        <h1>Lorem Ipsum</h1>
                        <span>wordpress</span>
                        
                        <div class="photo">
                            <img src="./img/Inner/1.png" >
                        </div>
                    </div>
                    <div class="blocks  wow fadeInUp" data-wow-delay="200ms">
                        <h1>established</h1>
                        <span>majemto</span>
                        
                        <div class="photo">
                            <img src="./img/Inner/2.png" >
                        </div>
                    </div>
                    <div class="blocks  wow fadeInUp" data-wow-delay="300ms">
                        <h1>randomised</h1>
                        <span>Drupal</span>
                        
                        <div class="photo">
                            <img src="./img/Inner/3.png" >
                        </div>
                    </div>
                    <div class="blocks  wow fadeInUp" data-wow-delay="400ms">
                        <h1>accompanied</h1>
                        <span>blog designing</span>
                        
                        <div class="photo">
                            <img src="./img/Inner/4.png" >
                        </div>
                    </div>
                    <div class="blocks  wow fadeInUp" data-wow-delay="500ms">
                        <h1>consectetur</h1>
                        <span>web designing</span>
                        
                        <div class="photo">
                            <img src="./img/Inner/5.png" >
                        </div>
                    </div>
                    <div class="blocks  wow fadeInUp" data-wow-delay="600ms">
                        <h1>embarrassing</h1>
                        <span>Print Designing</span>
                        
                        <div class="photo">
                            <img src="./img/Inner/6.png" >
                        </div>
                    </div>
                    <div class="blocks  wow fadeInUp" data-wow-delay="100ms">
                        <h1>Lorem Ipsum</h1>
                        <span>web developing</span>
                        
                        <div class="photo">
                            <img src="./img/Inner/7.png" >
                        </div>
                    </div>
                    <div class="blocks  wow fadeInUp" data-wow-delay="200ms">
                        <h1>reasonable</h1>
                        <span>CMS</span>
                        
                        <div class="photo">
                            <img src="./img/Inner/8.png" >
                        </div>
                    </div>
                    <div class="blocks  wow fadeInUp" data-wow-delay="300ms">
                        <h1>undoubtable</h1>
                        <span>joomla</span>
                        
                        <div class="photo">
                            <img src="./img/Inner/9.png" >
                        </div>
                    </div>
                    
                </div>
            </div>
        </div>
        
    </div>

   <!-- 底部 -->
   <div class="footer">
    <div class="juzhong">
        <div class="footer-content wow fadeInUp" data-wow-delay="100ms">
            <span class="webword">webword</span>
            <p>
                There are many variations of passages of Lorem Ipsum available, but the majority have suffered alteration in some form, by injected humour, or randomised words which don't look even slightly believable. If you are going to use a passage of  
            </p>
            
        </div>

        <div class="footer-content wow fadeInUp" data-wow-delay="200ms">
            <span>contact</span>
            <p>There are many variations of passages of Lorem Ipsum available, but the majority have</p>
            <ul>
                <li>New Delhi</li>
                <li>info@yourwebsite.com</li>
                <li>890-09880-45590</li>
            </ul>
        </div>

        <div class="footer-content latest  wow fadeInUp" data-wow-delay="300ms">
            <span>latest&nbsp;tweets</span>
            <p>
                Lorem Ipsum is simply dummy text of the printing and typesetting industry.
                <br>
                <span class="aa">1 Hour Ago</span>
            </p>
                
            <p>
                Lorem Ipsum is simply dummy text of the printing
                <br>
                <span class="aa">1 Hour Ago</span>
            </p>
        
        </div>

        <div class="footer-content news  wow fadeInUp" data-wow-delay="400ms">
            <span>news&nbsp;letter</span>
            <p>Type your email address below and recive our daily news letter for free</p>
            <div class="go">
                <input type="text" placeholder="Email Address">
                <span>GO</span>
            </div>
        </div>

        
    </div>
    
</div>

<!-- 版权 -->
<div class="copyright">
        <div class="juzhong">
            <p class="co-desc wow fadeInUp" data-wow-delay="100ms">© 2013 All rights reserved.  Theme by cssauthor.com</p>
            <div class="co-logo">
                <img src="./img/Inner/111.png" class=" wow fadeInUp" data-wow-delay="200ms">
                <img src="./img/Inner/222.png" class=" wow fadeInUp" data-wow-delay="300ms">
                <img src="./img/Inner/333.png" class=" wow fadeInUp" data-wow-delay="400ms">
            </div>
        </div>
</div>
</body>
</html>
<script src="./js/wow.min.js"></script>
<script>
    //初始化
    new WOW().init();
</script>